//自定义指令v-pin  el 元素  binding传进来的值和一些其他基本属性
Vue.directive("pin",function(el,binding){
    var pinned = binding.value;
    var position = binding.modifiers;
    var warning = binding.arg;
    console.log("warning",warning);

    // console.log(val);
    if(pinned){
        el.style.position = 'fixed';

        for(var key in position){
            if(position[key]){
                el.style[key] = '10px';
            }
        };
        if(warning === 'true'){
            el.style.background = "yellow";
        }

        // el.style.top = '10px';
        // el.style.left = '10px';
    } else{
        el.style.position = 'static';
    }
});

//上面只是加载了组件, 还没有用上, 需要渲染出来
new Vue({
    el:"#app",
    data:{
        card1:{
          pinned:false,
        },
        card2:{
            pinned:false,
        },
    }
});
